import { getCurrentTheme, initThemeSystem } from './utils/theme/theme'
import { watchEffect, createApp } from 'vue'
import pinia from './stores'
import Antd from 'ant-design-vue'
import App from './App.vue'
import { useTitle } from '@vueuse/core'
import router from './router'

async function bootstrap() {
    const app = createApp(App)

    app.use(Antd)
    app.use(pinia)
    app.use(router)

    // 初始化主题系统 (需要在Pinia安装后调用)
    const currentTheme = getCurrentTheme()
    const themeType = currentTheme || (import.meta.env.DEV ? import.meta.env.VITE_BASE_THEME : 'light')

    initThemeSystem(themeType)

    // 动态更新标题
    watchEffect(() => {
        const routeTitle = router.currentRoute.value.meta.title as string
        const pageTitle = (routeTitle ? `${routeTitle} - ` : '') + 'EasyAdmin'
        useTitle(pageTitle)
    })

    app.mount('#app')

    // 隐藏loading动画
    try {
        const { loadingFadeOut } = await import('virtual:app-loading')
        loadingFadeOut()
    } catch (error) {
        console.warn('Loading fade out function not available:', error)
    }
}

export { bootstrap }
